<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style type="text/css">
			*{
				padding: 0;
				margin: 0;
			}
			body{
				font-size: 12px;
				font-family:"Microsoft Yahei", "微软雅黑", Verdana, "宋体";
				color: #5e5e5e;
				background-color: #f5f5f5;
			}
			ul li{
				list-style-type: none;
			}
			a{
				text-decoration: none;
			}
			#nav-head{
				width: 100%;
				height: 50px;
				text-align: center;
				background-color: rgba(0, 0, 0, 0.6);
			}
			#head{
				width: 1226px;
				height: 50px;
				margin: 0 auto;
			}
			
			#head #logo{
				float: left;
			}
			#logo ul>li{
				float: left;
				height: 50px;
				line-height: 50px;
				position: relative;
			}
			#logo ul>li>a{
				font-size: 16px;
				padding: 19px 20px 0px;
				color: #fefefe;
			}
			#logo ul>li>a:hover{
				color: #f93a35;
			}
			#logo ul>li>a>img{
				margin-left: 5px;
			}
			#head #dengzhu{
				float: right;
			}
			#dengzhu ul>li{
				float: left;
				height: 50px;
				line-height: 50px;
				color: #fefefe;
				padding: 0px 5px 0px 0px;
			}
			#dengzhu ul>li>a{
				color: #fefefe;
				font-size: 16px;
				padding: 0px 10px;
			}
			#dengzhu ul>li>a:hover{
				color: #f93a35;
			}
			#tag{
			    width: 750px;
			    min-height: 485px;
			    font-weight: 600;
			    position: absolute;
			    top: 50px;	
			    left: 5px;
			    display: none;
				box-shadow: 1px 2px 3px #c8c8cc;
				background-color: white;
			}
			#logo #mudi:hover #tag{
				display: block;
			}
			#tag #zhou,#guoji{
				float: left;
				min-height: 485px;
			}
			#guoji{
				width: 240px;
				min-height: 485px;
				border-right: 1px solid;
			}
			#dingzhi{
				width: 130px;
				position: absolute;
				top: 50px;
				left: 5px;
				height: 120px;
				font-size: 16px;
				box-shadow: 1px 2px 3px #c8c8cc;
				display: none;
			}
			#dingzhi .xiaotuan span{
				width: 40px;
				height: 20px;
				display: inline-block;
				color: #F93A35;
			}
			#dingzhi .xiaotuan{
				height: 40px;
				line-height: 40px;
				background-color: white;
			}
			#dingzhi .xiaotuan:hover{
				background-color: #eee;
			}
			#dingzhi .xiaotuan a{
				color: #101010;
			}
			#zhuti:hover #dingzhi{
				display: block;
			}
			#fuwu{
				position: absolute;
				top: 50px;
				left: 5px;
				width: 130px;
				display: none;
				box-shadow: 1px 2px 3px #c8c8cc;
			}
			#fuwu .xiaotuan{
				height: 40px;
				line-height: 40px;
				background-color: white;
			}
			#fuwu .xiaotuan:hover{
				background-color: #eee;
			}
			#fuwu .xiaotuan span{
				width: 30px;
				height: 20px;
				display: inline-block;
				color: #F93A35;
				padding-left: 5px;
			}
			#fuwu .xiaotuan a{
				color: #101010;
			}
			#luxing:hover #fuwu{
				display: block;
			}
			#miyoudeng{
				width: 1138px;
				height: 440px;
				margin: 0 auto;
				border: 1px solid #dedede;
				margin-top: 100px;
				background-color: white;
			}
			#miyoudeng h1{
				width: 100%;
				height: 80px;
				line-height: 80px;
				text-align: center;
				border-bottom: 1px solid #dedede;
				font-size: 30px;
				color: #000;
				font-weight: normal;
			}
			#miyoudeng #lofo-left,#lofo-right{
				float: left;
			}
			#miyoudeng #lofo-left {
				width: 700px;
				height: 340px;
				border-right: 1px dotted #ccc;
				margin-top: 10px;
				text-align: center;
			}
			#miyoudeng #lofo-right{
				width: 360px;
				margin-top: 45px;
				padding-left: 50px;
			}
			#miyoudeng #lofo-right h3,p{
				margin-bottom: 5px;
			}
			#miyoudeng #lofo-right p{
				line-height: 20px;
			}
			#miyoudeng #lofo-right a{
				width: 120px;
				height: 30px;
				line-height: 30px;
				text-align: center;
				background-color: #be4534;
				margin-top: 20px;
				display: inline-block;
				color: #fff;
				font-weight: bold;
				font-size: 14px;
			}
			#miyoudeng #lofo-right a:hover{
				text-decoration: underline;
			}
			#left-logo{
				width: 236px;
				height: 300px;
				margin: 0 auto;
				margin-top: 35px;
			}
			#lofo-left #logo-nav{
				width: 236px;
				height: 30px;
				line-height: 30px;
			}
			#lofo-left #logo-nav span{
				width: 114px;
				height: 30px;
				display: inline-block;
				font-size: 16px;
				border-bottom: 2px solid;
			}
			#lofo-left #phone{
				width: 234px;
				height: 32px;
				padding-left: 7px;
				border: 1px solid #ccc;
				border-radius: 3px;
				outline: none;
				margin-top: 20px;
			}
			#lofo-left #yanzheng{
				width: 152px;
				height: 32px;
				padding-left: 7px;
				border: 1px solid #ccc;
				border-radius: 3px;
				outline: none;
				margin-top: 10px;
			}
			#texthao{
				width: 240px;
				text-align: left;
			}
			#texthao>a{
				width: 80px;
				height: 32px;
				line-height: 32px;
				text-align: center;
				background-color: #be4534;
				display: inline-block;
				color: #fff;
				font-weight: bold;
				font-size: 14px;
				margin-left: 160px;
				float: left;
				margin-top: -34px;
			}
			#texthao #xiaci{
				width: 100px;
				height: 20px;
				font-size: 14px;
				float: left;
				margin-top: 10px;
			}
			#texthao #wangji{
				margin-top: 10px;
				width: 80px;
				height: 20px;
				font-size: 14px;
				float: right;
				text-align: right;
			}
			#texthao #wangji>a{
				color: #be4534;
			}
			#texthao #denglu>a{
				width: 120px;
				height: 32px;
				line-height: 32px;
				text-align: center;
				background-color: #be4534;
				display: inline-block;
				color: #fff;
				font-weight: bold;
				font-size: 14px;
				margin-top: 20px;
			}
			#texthao #zhijie{
				margin-top: 25px;
				font-size: 14px;
			}
			#texthao #imgtu{
				margin-top: 10px;
			}
			#texthao #imgtu a{
				margin-right: 15px;
			}
			#guoji .yazhou .tc_zhou{
				height: 40px;
				font-size: 16px;
				color: #F93A35;
				cursor: default;
				line-height: 40px;
				text-align: left;
				padding-left: 20px;
			}
			#guoji .yazhou .tc_juti{
				width: 240px;
				height: 70px;
				line-height: 70px;
				box-shadow: 1px 2px 3px #c8c8cc;
				border-bottom: 1px solid;
			}
			#guoji .yazhou .tc_juti>div{
				float: left;
			}
			#guoji .yazhou .tc_juti>.tc_jutidi{
				width: 200px;
				height: 50px;
			}
			#guoji .yazhou .tc_juti>.tc_jutidi a{
				height: 20px;
				width: 60px;
				line-height: 20px;
				color: #101010;
				display:block;
				float: left;
				font-size: 14px;
				margin-left: 20px;
				text-align: center;
				padding: 0;
			}
			#guoji .yazhou .tc_juti>.tc_jutidi a:hover{
				background-color: #F93A35;
				color: white;
			}
			#guoji .yazhou .tc_juti .tc_fuhao{
				width: 40px;
				height: 70px;
				background-color: wheat;
			}
			
			#guoji .yazhou1 .tc_zhou1{
				height: 40px;
				font-size: 16px;
				color: #F93A35;
				cursor: default;
				line-height: 40px;
				text-align: left;
				padding-left: 20px;
			}
			#guoji .yazhou1 .tc_juti1{
				width: 240px;
				height: 40px;
				line-height: 40px;
				box-shadow: 1px 2px 3px #c8c8cc;
				border-bottom: 1px solid;
			}
			#guoji .yazhou1 .tc_juti1>div{
				float: left;
			}
			#guoji .yazhou1 .tc_juti1>.tc_jutidi1{
				width: 200px;
				height: 40px;
			}
			#guoji .yazhou1 .tc_juti1>.tc_jutidi1 a{
				height: 20px;
				width: 60px;
				line-height: 20px;
				color: #101010;
				display:block;
				float: left;
				font-size: 14px;
				margin-left: 20px;
				text-align: center;
				padding: 0;
			}
			#guoji .yazhou1 .tc_juti1>.tc_jutidi1 a:hover{
				background-color: #F93A35;
				color: white;
			}
			#guoji .yazhou1 .tc_juti1 .tc_fuhao1{
				width: 40px;
				height: 40px;
				background-color: wheat;
			}
		</style>
	</head>
	<body>
		<div id="all">
		<div id="nav-head">
		<div id="head">
			<div id="logo">
				<ul>
					<li><a href="#"><img src="img/logo.png"/></a></li>
					<li><a href="#">首页</a></li>
					<li id="mudi"><a href="#">目的地<img src="img/2017-08-28_085617.png"></a>
						<div id="tag">
									<div>
										<div id="guoji">
											<div class="yazhou">
												<div class="tc_zhou">亚洲</div>
												<div class="tc_juti">
												<div class="tc_jutidi">
													<a href="#">斯里兰卡</a>
													<a href="#">越南</a>
													<a href="#">缅甸</a>
													<a href="#">尼泊尔</a>
													<a href="#">日本</a>
													<a href="#">中国香港</a>
												</div>
												<div class="tc_fuhao"></div>
												</div>
											</div>
											<div class="yazhou">
												<div class="tc_zhou">欧洲 Europe </div>
												<div class="tc_juti">
												<div class="tc_jutidi">
													<a href="#">冰岛</a>
													<a href="#">爱尔兰</a>
													<a href="#">比利时</a>
													<a href="#">法国</a>
													<a href="#">英国</a>
													<a href="#">德国</a>
												</div>
												<div class="tc_fuhao"></div>
												</div>
											</div>
											<div class="yazhou1">
												<div class="tc_zhou1"> 美洲 America </div>
												<div class="tc_juti1">
												<div class="tc_jutidi1">
													<a href="#">美国</a>
													<a href="#">加拿大</a>
												</div>
												<div class="tc_fuhao1"></div>
												</div>
											</div>
											<div class="yazhou1">
												<div class="tc_zhou1">大洋洲 Oceania </div>
												<div class="tc_juti1">
												<div class="tc_jutidi1">
													<a href="#">澳大利亚</a>
													<a href="#">新西兰</a>
												</div>
												<div class="tc_fuhao1"></div>
												</div>
											</div>
											<div class="yazhou1">
												<div class="tc_zhou1">中东 Middle East </div>
												<div class="tc_juti1">
												<div class="tc_jutidi1">
													<a href="#">土耳其</a>
													<a href="#">阿曼联</a>
												</div>
												<div class="tc_fuhao1"></div>
												</div>
											</div>
											<div class="yazhou1">
												<div class="tc_zhou1">南美洲 South America</div>
												<div class="tc_juti1">
												<div class="tc_jutidi1">
													<a href="#">巴西</a>
													<a href="#">墨西哥</a>
												</div>
												<div class="tc_fuhao1"></div>
												</div>
											</div>
											<div class="yazhou1">
												<div class="tc_zhou1">非洲 Africa </div>
												<div class="tc_juti1">
												<div class="tc_jutidi1">
													<a href="#">南非</a>
													<a href="#">埃及</a>
												</div>
												<div class="tc_fuhao1"></div>
												</div>
											</div>
										</div>
										<div id="zhou"></div>
									</div>
						</div>
					</li>
					<li id="zhuti"><a href="#">主题定制<img src="img/2017-08-28_085617.png"></a>
						<div id="dingzhi">
							<div class="xiaotuan"><a href="#">定制小团</a><span>HOT</span></div>
							<div class="xiaotuan"><a href="#">海外看房</a><span></span></div>
							<div class="xiaotuan"><a href="#">商务考察</a><span></span></div>
						</div>
					</li>
					<li id="luxing"><a href="#">旅行服务<img src="img/2017-08-28_085617.png"></a>
						<div id="fuwu">
							<div class="xiaotuan"><a href="#">精品路线</a><span>HOT</span></div>
							<div class="xiaotuan"><a href="#">畅游包车</a><span></span></div>
							<div class="xiaotuan"><a href="#">接送机</a><span></span></div>
							<div class="xiaotuan"><a href="#">结伴拼车</a><span></span></div>
							<div class="xiaotuan"><a href="#">当地玩乐</a><span></span></div>
							<div class="xiaotuan"><a href="#">配套服务</a><span></span></div>
						</div>
					</li>
					<li><a href="#">接送机</a></li>
					<li><a href="#">定制包机</a></li>
				</ul>
			</div>
			<div id="dengzhu">
				<ul>
					<li><img src="img/2017-08-28_090424.png" align="center"></li>
					<li><a href="#">登陆</a><span>|</span></li>
					<li><a href="#">注册</a></li>
					<li><img src="img/2017-08-28_090445.png" align="center"></li>
					<li>4008-350-990</li>
				</ul>
			</div>
		</div>
	</div>
	<div id="miyoudeng">
		<h1>登录蜜柚旅行</h1>
		<div id="lofo-left">
			<div id="left-logo">
			<div id="logo-nav">
				<span id="phonezhang">手机账号登录</span>
				<span id="miyouzhang">蜜柚账号登录</span>
			</div>
			<div id="texthao">
			<input type="text" placeholder="请输入手机号" id="phone"/>
			<input type="text" placeholder="请输入验证码" id="yanzheng"/>
			<a href="#">获取验证码</a>
			<div id="xiaci">下次自动登录</div>
			<div id="wangji"><a href="#">忘记密码</a></div>
			<div id="denglu"><a href="#">登录</a></div>
			<div id="zhijie">直接使用网站合作账号登录</div>
			<div id="imgtu"><a href="#"><img src="img/2017-08-27_191959.png"></a><a href="#"><img src="img/2017-08-27_192029.png"></a><a href="#"><img src="img/2017-08-27_192054.png"></a></div>
			</div>
			</div>
		</div>
		<div id="lofo-right">
			<h3>会员注册</h3>
			<p>还不是蜜柚会员，那你就OUT啦！<br>
				20秒注册，快捷方便
			</p>
			<a href="#">注册会员</a>
		</div>
	</div>
	</div>
	</body>
</html>

